<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>新增商户</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
        <link rel="stylesheet" href="../../css/public.css" media="all">
        <style>
            body {
                background-color: #ffffff;
            }
        </style>
    </head>
    <body>
        <div class="layui-form layuimini-form">

            <div class="layui-form-item">
                <label class="layui-form-label required">菜单名称</label>
                <div class="layui-input-block">
                    <input type="text" name="title" lay-verify="required" lay-reqtext="" placeholder="请输入菜单名称" value=""
                           class="layui-input">
                </div>
            </div>
<!--            上级菜单id-->
            <input type="hidden" id="pid" name="pid">
            <div class="layui-form-item">
                <label class="layui-form-label required">上级菜单</label>
                <div class="layui-input-block">
                    <input type="text" name="pidname" lay-verify="required" lay-reqtext="" placeholder="请输入上级菜单"
                           value="" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">菜单地址</label>
                <div class="layui-input-block">
                    <input type="text" name="href"  lay-verify="required" lay-reqtext="" placeholder="请输入菜单地址"
                           value="javascript:void(0);" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">菜单图标</label>
                <div class="layui-input-block">
                    <input type="text" name="icon" id="buttonId"lay-verify="required" placeholder="请选择菜单图标" value=""
                           class="layui-input" readonly>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">菜单序号</label>
                <div class="layui-input-block">
                    <input type="text" name="sort" lay-verify="required" placeholder="请输入菜单序号" value=""
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">备注</label>
                <div class="layui-input-block">
                    <input type="text" name="remark" lay-verify="required" placeholder="请输入备注" value=""
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="saveBtn">确认保存</button>
                </div>
            </div>
        </div>
        <script src="../../lib/layui/layui.js" charset="utf-8"></script>
        <script src="https://cdn.bootcss.com/blueimp-md5/2.12.0/js/md5.min.js"></script>
        <script>
            layui.use(['form'], function () {
                var form = layui.form,
                    layer = layui.layer,
                    $ = layui.$;
                //监听提交
                form.on('submit(saveBtn)', function (data) {
                    var str = "确定新增菜单信息？";
                    layer.confirm(str, {btn: ['确定', '取消'], title: "提示"}, function (index) {
                        $.ajax({
                            url: '/channel/sys-menu/add',
                            type: 'POST',
                            dataType: 'json',
                            data:data.field,
                            headers:{'Authorization':'Bearer '+ JSON.parse(localStorage.getItem('userdetail')).token},
                            success: function(data) {
                                layer.msg("新增菜单成功", {
                                    icon: 6,//成功的表情
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                }, function () {
                                    var iframeIndex = parent.layer.getFrameIndex(window.name);
                                    parent.layer.close(iframeIndex);
                                });
                            },
                            error:function (data) {
                                //console.log('error', data);
                                var iframeIndex = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(iframeIndex);
                            }
                        });

                    });
                    return false;
                });
                //选择图标
                $(document).on('click','#buttonId',function (obj) {
                    var index = layer.open({
                        area: ['800px', '500px'],
                        title: '请选择菜单图标',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        content: '/page/icon.html',
                        success: function() {

                        },
                        end: function () {//无论是确认还是取消，只要层被销毁了，end都会执行，不携带任何参数。layer.open关闭事件
                            var icon=localStorage.getItem("icon");
                            $("#buttonId").val(icon);
                            localStorage.removeItem("icon");
                        }
                    });

                });
            });
        </script>
    </body>
</html>